
(ns ura.test
  (:require
   [reagent.core :as r]
   [reagent.dom :as rd]
   [re-frame.core :as fc]
   [stylefy.core :as sty]
   [stylefy.reagent :as stylefy-reagent]

   [ura.common :as uc :refer [log]]
   [ura.ui :as ui]
   [ura.style :refer [attr]]
   [ura.notify :refer [showNotify]]
   [ura.popup :refer [showPopup]]
   [ura.select :refer [my-select]]
   [ura.modal :refer [MyModal]]

   ))


(fc/reg-event-fx
 :toggleNotify  (fn [coeffects event]
                  (let [db (:db coeffects)

                        bg (:bg db)
                        newBg (if (= "red" bg) "green" "red")
                        notify (:notify db)
                        newNotify (not notify)
                        
                        newdb {:notify newNotify :bg newBg }
                        ]
                    (log "reg-event-fx: " db newdb)
                    ;;{:db (assoc db :state (not state))}
                    {:db newdb :bg newBg :notify newNotify}
                    )
                  ))


(fc/reg-fx :bg (fn [val]
                 (log "reg fx new bg: " val)
                 ))
(fc/reg-fx :notify (fn [val]
                     (log "reg fx new notify: " val)
                     ))


(fc/reg-sub :bg (fn [db v]
                  (log "reg-sub: " db v)
                  (:bg db)
                  )
            )

(fc/reg-sub :notify (fn [db v] (:notify db)))

(defn notifyPane []
  (let [isShow (fc/subscribe [:notify])
        bg (fc/subscribe [:bg "asdf"])]
    (fn []
      [:div             
       [:div {:style {:background @bg}} "show: " @isShow " :"]
       ]
      )
    )
  )


(defn my-popup [& args]
  (let [isShow (r/atom false)]
    (fn []
      [:div
       [:button.button {:on-click #(showPopup % [:span "tet"])} "popup"]
       ]
      )
    )
  )


(def model1 (r/atom false))

(defn testPage []
  [:div               ;;:display=grid
   ;;[:grid-template-columns "100px 300px 100px"];
   ;;[:grid-template-rows "100px 100px 100px"]

   [:div (attr :flex :jc-s)

    [:button.button {:on-click #(fc/dispatch [:toggleNotify "test1"])} "re-frame test"]

    [notifyPane]
    ]

   [:div (attr :flex :jc-s)
    [my-select {:model (r/atom #{})}
     [:option {:value "a1"} "a1"]
     [:option {:value "a2"} "a2"]
     [:option {:value "a3"} "a3"]
     [:option {:value "a4"} "a4"]
     [:option {:value "a5"} "a5"]
     ]
    ]

   [:div (attr :flex :js-s)

    
    [:div.select.is-link
     [:button.is-primary]
     [:select
      [:option {} nil]
      [:option {} "sel1ect"]
      [:option {} "sel1ect2"]
      ]
     ]
    ]

   [:div (attr :flex)
    [MyModal {:title "test title" :isShow true}
     [:div {} "modal content"]
     ]
    [:button.button.is-primary {:on-click #()} "modal"]
    
    ]
   
   ]
  )
